<template>
	<div class="user-bar">
		
	</div>

</template>

<script>
  import MyExportCenter from "@/layout/components/exportCenter.vue";
	import ExLabel from "@/components/exLabel/index.vue";
	import MessageView from "@/views/setting/messageCenter/view.vue";
  import useTabs from "@/utils/useTabs";
	import tool from "@/utils/tool";
	import globalparam from "@/constant/model/globalparam";
	import exDialog from '@/components/exDialog';

	export default {
    emits: ['setmsg'],
		computed: {

		},
		components: {
			MessageView,
			ExLabel,
      MyExportCenter,
			exDialog
		},
		data(){
			return {
				userName: "",
				userNameF: "",
				roleName:"",
				roles:[],
				userId:"",
				isProxyLogin:"",
				searchVisible: false,
				tasksVisible: false,
				updatePasswordVisible:false,
				userCenterVisible:false,
				msg: false,
				messageCount:this.$store.state.websocket,
				msgCount: 0,
				msgList: [],
				fromRouteId:null,
				searchKeyword:null,
				searchLoading:false,
				messkeys:[
					{
						code:"01",
						name:"数据提醒",
						icon:"el-icon-chat-square"
					},
					{
						code:"02",
						name:"运营通知",
						icon:"el-icon-chat-square"
					},
					{
						code:"03",
						name:"系统日志",
						icon:"el-icon-chat-square"
					},
					{
						code:"04",
						name:"用量提醒",
						icon:"el-icon-chat-square"
					},
					{
						code:"05",
						name:"协作邀请",
						icon:"el-icon-chat-square"
					}
				],
				currkey:"01"
			}
		},
		watch:{
			messageCount:{
				handler(){
					this.loadMyMessage();
				},
				deep:true
			}
		},
		created() {
			this.isProxyLogin = this.$TOOL.data.get("IS_PROXY_LOGIN");
			let userInfo = this.$TOOL.data.get("USER_INFO");
			this.userId = userInfo.id;
			this.userName = userInfo.userName;
			this.userNameF = this.userName.substring(0,1);
			let currentRole = this.$TOOL.data.get("CURRENT_ROLE");
			this.roleName = currentRole.roleName;
			this.roles = this.$TOOL.data.get("USER_ROLES");
			this.fromRouteId = this.$TOOL.crypto.MD5("/index");
		},
		mounted() {
			this.loadMyMessage();

		},
		methods: {
			async searchHandler() {
				try {
					this.searchLoading = true;
					if (this.searchKeyword&&this.searchKeyword.trim().length>0) {
						let title = "首页关键字资产明细-"+this.searchKeyword.trim();
						//跳转到搜索台账页面
						let fromRouteId = this.$TOOL.crypto.MD5(this.$route.path);
						let key = this.$TOOL.crypto.MD5(title);
						if(this.$route.path.includes(key)){
							useTabs.refresh();
						}else{
							let assetStatisticsRange = await this.$cache.data.loadGlobalParam(globalparam.assetStatisticsRange.paramCode);
							//设置搜索参数
							let routeParams = {
								id: key,
								title: title,
								fixedParams:{
									assetStatisticsRange:assetStatisticsRange,
								},//固定搜索参数，打开页面后，用户通过搜索界面的清空按钮无法清除
								searchParams: {
									searchKeyword: this.searchKeyword,
								},//搜索参数，打开页面后，会设置在搜索界面搜索参数的默认值，用户可以改变
							};
							this.$store.dispatch("addRouteParams", routeParams);
							this.$router.push({
								name: "toAssetList",
								params: {fromRouteId: fromRouteId, key: key}
							});
						}
					}else{
						// this.$message.warning("请输入搜索关键字");
					}
				}finally {
					this.searchLoading = false;
				}
			},
			async loadMyMessage() {
				let rsp = await this.$API.system.message.myPageData.post({readStatus:'0'});
				if (rsp.code === 2000) {

					this.msgList = rsp.data.records;
				}
			},
			closenews(){
				//this.$refs.drawernews.closeDrawer();
				this.msg=false;
			},
			messageCenter(){
				this.msg = false;
				this.$router.push({name:"messageCenter",params:{fromRouteId:this.fromRouteId}});
			},
			async createMessage() {
				let message = {
					title: "测试消息",
					content: "于什么时候发送的消息",
					msgType: "message",
					receiveObjectType:'user',
					receiveObjectId: this.$TOOL.current.user().id,
					isEject:"1",
				};
				let rsp = await this.$API.system.message.add.post(message);
				if (rsp.code === 2000) {
					this.$emit('setmsg');
				}
			},
			async querymess(item){

				this.currkey=item.code;

			},
			async showMessage(msg) {
				this.closenews();
				if (msg.msgType.includes("document")) {
					let rsp = await this.$API.asset.document.findById.post({id: msg.relObjectId});
					if (rsp.code === 2000) {
						let document = rsp.data;
						this.$router.push({
							name: "documentPrepare",
							params: {
								fromRouteId: this.fromRouteId,
								configId: document.documentConfigId,
								id: document.id
							}
						});
					}
				} else if (msg.msgType.includes("asset_check")) {

				} else {
					this.$nextTick(() => {
						this.$refs.messageView.open(msg);
					})
				}
				this.markRead(msg.id);

			},
			//标记已读
			async markRead(msgId) {
				let msgIds = [];
				if(msgId){
					msgIds.push(msgId);
				}else{
					this.msgList.forEach(msg => {
						msgIds.push(msg.id);
					})
				}
				if (msgIds.length > 0) {
					let rsp = await this.$API.system.message.markMessage.post({ids: msgIds,markType:'read'});
					if(rsp.code===2000){
						this.loadMyMessage();
						this.$emit('setmsg');
					}
				}
			},
			handleRole(command){
				let authMap = this.$TOOL.data.get("AUTH_MAP");
				let auth = authMap[command];
				if(auth){
					if(this.$TOOL.current.role().id !== command){
						//将按钮放入缓存
						this.$TOOL.data.set("CURRENT_ROLE", auth.role);
						this.$TOOL.data.set("PERMISSIONS", auth.buttons);
						this.$TOOL.data.set("MENU", auth.menuTree);
							this.$store.commit("RESET_ROUTE", false);
						this.$router.replace({
							path: '/'
						});
						setTimeout(()=>{
							this.$router.go();
						},10);
					}
				}
			},
			//个人信息
			handleUser(command) {
				if(command == "uc"){
					// this.$router.push({path: '/usercenter'});
					this.userCenterVisible = true;
				}
				if(command == "cmd"){
					this.$router.push({path: '/cmd'});
				}
				if(command == "changlayout"){
					let layout=this.$store.state.global.layout;
					let name=layout=="default"?"通栏":"默认";
					this.$confirm('切换'+name+'布局，是否继续？','提示', {
						type: 'info',
					}).then(() => {
						if(layout=="default"){
						this.$store.commit("SET_layout", "header");
						}else{
							this.$store.commit("SET_layout", "default");
						}
          }).catch(() => {
						//取消
					})
				}
				if(command == "clearCache"){
					this.$confirm('清除缓存会将系统初始化，包括登录状态、主题、语言设置等，是否继续？','提示', {
						type: 'info',
					}).then(() => {
						const loading = this.$loading();
            this.$TOOL.current.clear();
						this.$TOOL.data.clear();
						setTimeout(() => {
						loading.close();
						this.$router.replace({path: '/login'});
						}, 1000);
          }).catch(() => {
						//取消
					})
				}
        if(command === "refreshData"){
          this.$confirm('此操作将会清除缓存数据，并重新加载，是否继续？','提示', {
            type: 'info',
          }).then(() => {
            this.$cache.dic.init();
            this.$cache.data.clearAll();
			this.$cache.tree.clearAll();
            this.$message.success("请求已完成");
          }).catch(() => {
            //取消
          })
        }
				if(command == "outLogin"){
					this.$confirm('确认是否退出当前用户？','提示', {
						type: 'warning',
						confirmButtonText: '退出'
					}).then(() => {
            const loading = this.$loading();
              this.$TOOL.current.clear();
              this.$cache.data.clearAll();
						this.$cache.tree.clearAll();
            setTimeout(() => {
              loading.close();
              this.$router.replace({path: '/login'});
            }, 1000);
					}).catch(() => {
						//取消退出
					})
				}
				if(command == "backData"){
					this.$confirm('确认是否返回到主账号？','提示', {
						type: 'warning',
						confirmButtonText: '返回',
						confirmButtonClass: 'el-button--danger'
					}).then(async () => {
            let mainLoginUser = tool.data.get("MAIN_LOGIN_USER");
            let valid = await this.$cache.login.assemble(mainLoginUser, false, this);
            if (valid) {
              window.location.href = "/";
              // //进入首页
              // this.$router.replace({
              // 	path: '/'
              // })
            }
          }).catch(() => {
						//取消返回
					})
				}
			},
      refresh(){
        useTabs.refresh();
      },
			//全屏
			screen(){
				var element = document.documentElement;
				this.$TOOL.screen(element);

			},
			//显示短消息
			showMsg(){
				this.msg = true;
			},


			//搜索
			search(){
				this.searchVisible = true
			},
			//任务
			tasks(){
				this.tasksVisible = true
			},
      exportCenter(){
        this.$refs.myExportCenter.open();
      },
	  home(){
				this.$router.push('/index');
			}

		}
	}
</script>

<style>
	.user-bar {display: flex;align-items: center;height: 100%;padding-right: 64px;}
	.user-bar .panel-item {padding: 0 10px;padding-bottom: 0px;cursor: pointer;
		display: flex;align-items: center;}
	.user-bar .panel-item i {font-size: 16px;}

	.user-bar .user-avatar {height:69px;display: flex;align-items: center;}
	.user-bar .user-avatar label {display: inline-block;margin-left:5px;font-size: 13px;cursor:pointer;
	color: rgba(51, 51, 51, 1);
  font-size: 14px;
  font-weight: NaN;
  text-align: left;
  white-space: nowrap;
  font-family: PingFangSC-Semibold;
  font-weight: 400;
	}
	.adminui-header .user-bar .panel-item i{
		color: #FFF;
	}

	.msg-list li {border-top:1px solid #eee;}
	.msg-list li a {display: flex;padding:20px;}
	.msg-list li a:hover {background: #ecf5ff;}
	.msg-list__icon {width: 40px;margin-right: 15px;}
	.msg-list__main {flex: 1;}
	.msg-list__main h2 {font-size: 15px;font-weight: normal;color: #333;}
	.msg-list__main p {font-size: 12px;color: #999;line-height: 1.8;margin-top: 5px;}
	.msg-list__time {width: 100px;text-align: right;color: #999;}

	.dark .msg-list__main h2 {color: #d0d0d0;}
	.dark .msg-list li {border-top:1px solid #363636;}
	.dark .msg-list li a:hover {background: #383838;}

	.drawer-entry-title {
    margin: auto;
    padding-bottom: 20px !important;
    padding: 20px;
    border-bottom: 1px solid #ebecee;
    text-align: center;
    font-size: 20px;
    color: #141e31;
}
.drawer-content{
	padding: 20px;
	border: 1px #eee solid;
}


.messnav {width: 210px;padding-top: 20px;}
.messnav li {padding:0 10px;margin: 0 10px 0 0;font-size: 14px;
	width: 100px;
	list-style: none;height: 100%;display: flex;align-items: center;cursor: pointer;
	padding: 15px 20px;
	margin-bottom: 3px;
	width: 210px;
}

.messnav li i {margin-right: 5px;}
.messnav li:hover {
	background-color: #e3f2fd;
    border-left: 3px solid #427CFF;
    color: #427CFF;
}
.messnav li:hover i{
	margin-left: 5px !important;
	transition: all 400ms ease;
}
.messnav li.active {
    background-color: #e3f2fd;
    border-left: 3px solid #427CFF;
    color: #427CFF;
}




.divrefresh{

  border-radius: 4px;
  height: 38px;
  width: 38px;
  margin-top: 0px;
  cursor: pointer;
  border: 1px #FFF solid;
}
.adminui-header .divrefresh{
	border: 1px rgb(72, 154, 237) solid;
}
.divrefresh:hover{
	background-image: linear-gradient(
    221deg,
    rgba(241, 246, 253, 1) 0,
    rgba(241, 246, 253, 1) 0,
    rgba(210, 227, 252, 1) 100%,
    rgba(210, 227, 252, 1) 100%
  );
	border: 1px solid rgba(105, 178, 251, 1);
}


.adminui-header .divrefresh:hover{
	background-image: none;
	border: 1px rgb(72, 154, 237) solid;
}
.adminui-header .divscreen{
	border: 1px #066EC3 solid;
}
.divscreen{

  border-radius: 4px;
  height: 38px;
  width: 38px;
  margin: 0 0 0 0px;
  cursor: pointer;
  border: 1px #FFF solid;
}
.divscreen:hover{
	background-image: linear-gradient(
    221deg,
    rgba(241, 246, 253, 1) 0,
    rgba(241, 246, 253, 1) 0,
    rgba(210, 227, 252, 1) 100%,
    rgba(210, 227, 252, 1) 100%
  );
	border: 1px solid rgba(105, 178, 251, 1);
}

.divexportCenter{

  border-radius: 4px;
  height: 38px;
  width: 38px;
  margin: 0 0 0 0px;
  cursor: pointer;
  border: 1px #FFF solid;
}
.divexportCenter:hover{
	background-image: linear-gradient(
    221deg,
    rgba(241, 246, 253, 1) 0,
    rgba(241, 246, 253, 1) 0,
    rgba(210, 227, 252, 1) 100%,
    rgba(210, 227, 252, 1) 100%
  );
	border: 1px solid rgba(105, 178, 251, 1);
}
.adminui-header .divexportCenter{
	border: 1px rgb(72, 154, 237) solid;
}

.adminui-header .divexportCenter:hover{
	background-image: none;
	border: 1px rgb(72, 154, 237) solid;
}


.divrole{

  border-radius: 4px;
  height: 38px;
  width: 38px;
  margin: 0 0 0 0px;
}
.divrole:hover{
	background-image: linear-gradient(
    221deg,
    rgba(241, 246, 253, 1) 0,
    rgba(241, 246, 253, 1) 0,
    rgba(210, 227, 252, 1) 100%,
    rgba(210, 227, 252, 1) 100%
  );
	border: 1px solid rgba(105, 178, 251, 1);
}



.adminui-header .divrole:hover{
	background-image: none;
	border: none;
}

.divuser {

  border-radius: 4px;
  height: 38px;
  width: 38px;
  margin: 0 0 0 53px;
}
.divuser:hover{
	background-image: linear-gradient(
    221deg,
    rgba(241, 246, 253, 1) 0,
    rgba(241, 246, 253, 1) 0,
    rgba(210, 227, 252, 1) 100%,
    rgba(210, 227, 252, 1) 100%
  );
	border: 1px solid rgba(105, 178, 251, 1);
}


.adminui-header .divuser:hover{
	background-image: none;
	border: none;
}
@media (min-width: 1200px) and (max-width: 1600px){
	.user-bar{padding-right:20px;}
	.divuser{margin-left:20px;}
}


</style>
